<template>
  <div class="app-container">
    <div id="home">
      <headtitle>新闻资讯</headtitle>
    </div>
    <div class="mui-content">
      <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media">
          <router-link :to="'newsinfo/2'">
            <img class="mui-media-object mui-pull-left" src="../../img/shuijiao.jpg" />
            <div class="mui-media-body">
              幸福
              <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p>
            </div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media">
          <a href="javascript:;">
            <img class="mui-media-object mui-pull-left" src="../../img/muwu.jpg" />
            <div class="mui-media-body">
              木屋
              <p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.</p>
            </div>
          </a>
        </li>
        <li class="mui-table-view-cell mui-media">
          <a href="javascript:;">
            <img class="mui-media-object mui-pull-left" src="../../img/cbd.jpg" />
            <div class="mui-media-body">
              CBD
              <p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
            </div>
          </a>
        </li>
        <li class="mui-table-view-cell mui-media">
          <a href="javascript:;">
            <img class="mui-media-object mui-pull-left" src="../../img/shuijiao.jpg" />
            <div class="mui-media-body">
              幸福
              <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p>
            </div>
          </a>
        </li>
        <li class="mui-table-view-cell mui-media">
          <a href="javascript:;">
            <img class="mui-media-object mui-pull-left" src="../../img/muwu.jpg" />
            <div class="mui-media-body">
              木屋
              <p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.</p>
            </div>
          </a>
        </li>
        <li class="mui-table-view-cell mui-media">
          <a href="javascript:;">
            <img class="mui-media-object mui-pull-left" src="../../img/cbd.jpg" />
            <div class="mui-media-body">
              CBD
              <p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
            </div>
          </a>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import headtitle from "../head.vue";
export default {
  name: "",
  props: [""],
  data() {
    return {};
  },

  components: {
    headtitle
  },

  computed: {},

  beforeMount() {},

  mounted() {
    // mui.init({
    //   swipeBack: true //启用右滑关闭功能
    // });
  },

  methods: {},

  watch: {}
};
</script>
<style lang='' scoped>
a {
  text-decoration: none;
}
a:active {
  color: #0062cc;
}
.mui-ellipsis {
  width:71%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-container {
  overflow-x: hidden;
  overflow-y:auto
}
.mui-content {
  margin-top: 50px;
}
li:active {
  background-color: silver
}
</style>